<template>
	<view class="lease-order-detail">

		<view class="topView">
			<web-view v-if='isQian' :src="url" id="webview" onMessage="onWebviewMessage"
				style="width: 100%;height: 100%;">
			</web-view>
			<view class="flex-row-space-between" style="margin-left: 38rpx ;margin-right: 46rpx;padding-top: 160rpx;">
				<view v-if="orderStatus == 0" class="">
					<view class="statusTitle">
						待付款
					</view>
					<view class="statusTitle1">
						请尽快支付费用
					</view>
				</view>
				<view v-else-if="orderStatus == 1" class="">
					<view class="statusTitle">
						待发货
					</view>
					<view class="statusTitle1">
						订单生成等待商家发货
					</view>
				</view>
				<view v-else-if="orderStatus == 7" class="">
					<view class="statusTitle">
						审核不通过
					</view>
					<view class="statusTitle1">
						商家审核不通过
					</view>
				</view>
				<view v-else-if="orderStatus == 2" class="">
					<view class="statusTitle">
						待收货
					</view>
					<view class="statusTitle1">
						商家已发货请耐心等待
					</view>
				</view>

				<view v-else-if="orderStatus == 3" class="">
					<view class="statusTitle">
						进行中
					</view>
					<view class="statusTitle1">
						商品正在进行中
					</view>
				</view>
				<view v-else-if="orderStatus == 4" class="">
					<view class="statusTitle">
						已完成
					</view>
					<view class="statusTitle1">
						交易已完成
					</view>
				</view>
				<view v-else-if="orderStatus == 5" class="">
					<view class="statusTitle">
						已关闭
					</view>
					<view class="statusTitle1">
						如有支付金额将会在1-3个工作日内原路退还
					</view>
				</view>
				<view v-else-if="orderStatus == 6" class="">
					<view class="statusTitle">
						合同中
					</view>
					<view class="statusTitle1">
						请签署合同
					</view>
				</view>
				<view v-else-if="orderStatus == 8 && orderInfo.risk_status == 1" class="">
					<view class="statusTitle">
						审核通过
					</view>
					<view class="statusTitle1">
						商家审核通过
					</view>
				</view>
				<view v-else-if="orderStatus == 8" class="">
					<view class="statusTitle">
						待审核
					</view>
					<view class="statusTitle1">
						待审核
					</view>
				</view>
				<image class="orderImage" :src="getBaseUrl('order.png')" mode="scaleToFill"></image>

			</view>
			<view v-if="Number(orderInfo.delivery_type)==2" class="addressView">
				<view class="addressName">
					预留电话：{{orderInfo.link_mobile}}
				</view>
				<view class="addressName">
					自取时间：{{orderInfo.pick_up_time}}
				</view>
				<view class="delivery_address">
					自取地址：{{orderInfo.shop_info.city}}{{orderInfo.shop_info.op_area}}
				</view>

			</view>
			<view v-else class="addressView">
				<view class="addressName">
					<text>{{ orderInfo.consignee }}</text>
					<text class="ml20">{{ orderInfo.mobile }}</text>
				</view>
				<view class="delivery_address">
					{{ orderInfo.delivery_address }}
				</view>
			</view>




			<!-- Goods -->
			<view class="container">
				<!-- <view @click="shopButtonClick(orderInfo.shop_info.id)" class="flex-row-flex-start"
					style="margin: 20rpx 0;">
					<view class="store_name">
						{{orderInfo.shop_info.shop_name}}
					</view>
					<u-icon name="arrow-right" size="26" color="#000"></u-icon>
				</view> -->
				<lease-order-goods :image="goodsInfo.image">
					<template #name>{{ goodsInfo.goods_name }}</template>
					<template #specs>
						{{ goodsInfo.spec_value }}
						<!-- 		{{ goodsInfo.periods }}
						{{ getPeriodsUnit(goodsInfo.periods_attribute) }} -->
					</template>
					<template #price>
						<!-- 	<text>{{orderInfo.day_price}}/天</text>

						<text>（x{{ goodsInfo.periods }}期）</text> -->
					</template>
				</lease-order-goods>
			</view>


			<view class="view1">
				<view class="itemView flex-row-space-between">
					<view class="leftTitle">
						总金额
					</view>
					<view class="rightTitle">
						¥{{ orderInfo.order_amount }}
					</view>
				</view>
				<view class="itemView flex-row-space-between">
					<view class="leftTitle1">
						付款方式
					</view>
					<view class="rightTitle1">
						<text v-if='orderInfo.pay_type==1'>先享后付</text>
						<text v-if='orderInfo.pay_type==2'>全额支付</text>
					</view>
				</view>
				<!-- 	<view class="itemView flex-row-space-between">
					<view class="leftTitle1">
						每期应还
					</view>
					<view class="rightTitle1">
						¥{{ goodsInfo.issue_rent }}
					</view>
				</view>
				<view class="itemView flex-row-space-between">
					<view class="leftTitle1">
						总租金
					</view>
					<view class="rightTitle1">
						¥{{ goodsInfo.total_rent }}
					</view>
				</view>
				<view v-if='orderInfo.service' class="itemView flex-row-space-between">
					<view class="leftTitle1">
						{{orderInfo.service.s_name}}
					</view>
					<view class="rightTitle1">
						¥{{orderInfo.service.price}}
					</view>
				</view> -->
				<!-- 	<view class="itemView flex-row-space-between">
					<view class="leftTitle1">
						到期买断
					</view>
					<view class="rightTitle1">
						¥暂无
					</view>
				</view> -->
			</view>

			<view class="view1">

				<view class="itemView flex-row-space-between">
					<view class="leftTitle1">
						配送方式
					</view>
					<view class="rightTitle1">
						<text v-if="Number(orderInfo.delivery_type)==2">自取</text>
						<text v-if="Number(orderInfo.delivery_type)==1">快递</text>
					</view>
				</view>
				<!-- <view class="itemView flex-row-space-between">
					<view class="leftTitle1">
						运费
					</view>
					<view class="rightTitle1">
						¥{{goodsInfo.shipping_price || '0.00'}}
					</view>
				</view> -->
			</view>

			<view class="view1">
				<view class="itemView flex-row-space-between">
					<view class="leftTitle1">
						备注
					</view>
					<view class="rightTitle1">
						{{goodsInfo.user_remark || '-'}}
					</view>
				</view>
			</view>


			<view class="view1">
				<view class="itemView flex-row-space-between">
					<view class="leftTitle">
						订单信息
					</view>
					<view class="rightTitle">

					</view>
				</view>
				<!-- 	<view class="itemView flex-row-space-between">
					<view class="leftTitle1">
						支付方式
					</view>
					<view class="rightTitle1">
						{{ getPayWay(orderInfo.pay_way) }}
					</view>
				</view> -->
				<view class="itemView flex-row-space-between">
					<view class="leftTitle1">
						订单编号
					</view>
					<view class="rightTitle1">
						{{ orderInfo.order_sn }}
					</view>
				</view>
				<view class="itemView flex-row-space-between">
					<view class="leftTitle1">
						下单时间
					</view>
					<view class="rightTitle1">
						{{ orderInfo.create_time }}
					</view>
				</view>
			</view>

			<view class="" style="height: 160rpx;">

			</view>

		</view>
		<!-- Footer -->
		<!-- 		<view class="order-footer">
			<block v-for="index in getButtons(orderInfo.order_status)" :key="index">
				<view class="order-button" :class="[buttonList[index]['class']]">
					{{ buttonList[index].name }}
				</view>
			</block>
		</view> -->

		<view class="order-footer">

			<template v-if="orderInfo.op_status==1">
				待确认买断
			</template>
			<template v-else>
				<block v-for="index in getButtons(orderInfo.order_status)" :key="index">
					<view class="order-button" :class="[buttonList[index]['class']]"
						@tap="onOrderButton(buttonList[index].key)">
						{{ buttonList[index].name }}
					</view>
				</block>
				<!-- 	<template v-if="orderInfo.order_status == 1&&orderInfo.is_bind_bank==0">
					<view @click="daikouClick()" class="order-button order-button--inactive">签署代扣</view>
				</template> -->
			</template>

			<!-- 合同   -->
			<template v-if="orderInfo.order_status == 6">
				<view v-if='orderInfo.sign_url.length' @click="qianClick()" class="order-button order-button--inactive">
					签署合同</view>
				<!-- <template v-if="orderInfo.contract_status == 0">
					<view class="order-button order-button--inactive">待合同生成</view>
				</template>
				<template v-else-if="orderInfo.contract_status == 1">
					<view class="order-button order-button--normal" @tap="onOrderButton(buttonList[12].key)">上传合同</view>
				</template>
				<template v-else-if="orderInfo.contract_status == 2">
					<view class="order-button order-button--normal" @tap="onOrderButton(buttonList[12].key)">合同审核中
					</view>
				</template>
				<template v-else-if="orderInfo.contract_status == 3">
					<view class="order-button order-button--normal" @tap="onOrderButton(buttonList[12].key)">合同审核通过
					</view>
				</template>
				<template v-else-if="orderInfo.contract_status == 4">
					<view class="order-button order-button--error" @tap="onOrderButton(buttonList[12].key)">合同审核失败
					</view>
				</template> -->
			</template>
		</view>

		<!-- Widget -->
		<view>
			<!-- 取消订单 -->
			<u-modal v-model="showCloseOrderModal" content="取消订单" :show-cancel-button="true"
				@confirm="handleOrderClose" />

			<!-- 删除订单 -->
			<u-modal v-model="showDelOrderModal" content="删除订单" :show-cancel-button="true" @confirm="handleOrderDel" />

			<!-- 确认收货 -->
			<u-modal v-model="showConfirmOrderModal" content="确认收货" :show-cancel-button="true"
				@confirm="handleOrderConfirm" />

			<!-- 续租 -->
			<u-popup v-model="showReletOrderPopup" mode="center" border-radius="20">
				<view class="relet">
					<view class="relet-title">续租</view>
					<view class="relet-content">
						<view class="relet-label">请选择租期</view>
						<view class="relet-list">
							<block v-for="item in reletList" :key="item.periods_id">
								<view class="relet-item" :class="{'relet-item--active': relet == item.periods_id}"
									@tap="relet = item.periods_id">
									{{ item.name }}
								</view>
							</block>
						</view>
					</view>
					<view class="relet-widget">
						<view class="relet-cancel" @tap="showReletOrderPopup = false">取消</view>
						<view class="relet-confirm" @tap="handleRelet">确认</view>
					</view>
				</view>
			</u-popup>

			<!-- 还机 -->
			<u-popup v-model="showReturnOrderPopup" mode="center" border-radius="20">
				<view class="return">
					<view class="return-title">温馨提示</view>
					<view class="return-content">您当前租期未到期，提前还机需支付相应的违约金，是否确认还机？</view>
					<view class="return-widget">
						<view class="return-cancel" @tap="showReturnOrderPopup = false">取消</view>
						<view class="return-confirm" @tap="goReturnOrder">确认</view>
					</view>
				</view>
			</u-popup>
		</view>
	</view>
</template>


<script>
	import {
		leaseOrderCancel, // 取消订单
		leaseOrderDel, // 删除订单
		getLeaseOrderDetail, // 订单详情
		getLeaseOrderDrdersn, // 订单详情2
		leaseOrderConfirm, // 确认收货
		leaseOrderRelet, // 续租
		leaseReturnCheck, // 还机验证
	} from '@/api/lease.js';

	import {
		test_face,

	} from '@/api/activity.js';
	import {
		prepay,
		prepayment,
		getAlipayPayStatus
	} from '@/api/app';
	import {
		wxpay,
		alipay
	} from '@/utils/pay'
	import {
		copy
	} from '@/utils/tools'

	export default {
		data() {
			return {
				url: '',
				isQian: false,
				orderID: 0, // 订单ID
				ordersn: 0, // 订单编号
				orderStatus: 0, // 订单状态
				orderInfo: {}, // 订单信息
				goodsInfo: {}, // 商品信息
				showConfirmOrderModal: false, // 确认收货Modal
				showDelOrderModal: false, // 删除订单Modal
				showCloseOrderModal: false, // 取消订单Modal

				showReletOrderPopup: false, // 续租 Popup
				showReturnOrderPopup: false, // 还机 Popup
				reletList: [], // 续租期 数据列表
				relet: '', // 选择的租期
				// 按钮列表
				buttonList: {
					0: {
						key: 'pay',
						name: '立即付款',
						class: 'order-button--active'
					},
					1: {
						key: 'repayment',
						name: '去还款',
						class: 'order-button--active'
					},
					2: {
						key: 'receive',
						name: '确认收货',
						class: 'order-button--normal'
					},
					3: {
						key: 'evaluate',
						name: '去评价',
						class: 'order-button--normal'
					},
					4: {
						key: 'return',
						name: '还机',
						class: 'order-button--normal'
					},
					5: {
						key: 'buy',
						name: '买断',
						class: 'order-button--normal'
					},
					6: {
						key: 'buy_detail',
						name: '买断详情',
						class: 'order-button--normal'
					},
					7: {
						key: 'return_detail',
						name: '还机详情',
						class: 'order-button--normal'
					},
					8: {
						key: 'continue',
						name: '续租',
						class: 'order-button--normal'
					},
					9: {
						key: 'close',
						name: '取消订单',
						class: 'order-button--inactive'
					},
					10: {
						key: 'express',
						name: '查看物流',
						class: 'order-button--inactive'
					},
					11: {
						key: 'del',
						name: '删除订单',
						class: 'order-button--inactive'
					},
					12: {
						key: 'contract',
						name: '上传合同',
						class: 'order-button--normal'
					},
					13: {
						key: 'prepayment',
						name: '提前还款',
						class: 'order-button--active'
					},
				}
			}
		},

		computed: {
			// 每天多少钱
			oneDayPrice() {
				// const unit = this.goodsInfo.periods_attribute;
				// const issueRent = this.goodsInfo.issue_rent;
				// switch (unit) {
				// 	// case 'is_week': return (issueRent / 7).toFixed(1);
				// 	// case 'is_month': return (issueRent / 30).toFixed(1);
				// 	case 'is_week':
				// 		return Number((issueRent / 7).toString().match(/^\d+(?:\.\d{0,2})?/));
				// 	case 'is_month':
				// 		return Number((issueRent / 30).toString().match(/^\d+(?:\.\d{0,2})?/));
				// }

				return Number(this.orderInfo.day_price);
			},

			// 支付剩余倒计时
			payCountDown() {
				const orderInfo = this.orderInfo;

				const now = new Date().getTime() / 1000;
				const create = new Date(orderInfo.create_time).getTime() / 1000;
				const end = create + orderInfo.order_close_time;

				return end - now;
			}
		},

		methods: {
			shopButtonClick(shop_id) {
				uni.navigateTo({
					url: '/bundle/pages/lease_goods_details/shop?shop_id=' + shop_id
				})
			},
			onWebviewMessage(message) {
				console.log('onWebviewMessage>>>>>', message)
				// message && my.alert({
				//   title: '收到H5消息',
				//   content: JSON.stringify(message)
				// })
				const {
					detail: {
						type,
						token,
						url,
						authFlowId
					}
				} = message
				switch (type) {
					case 'IDENTITY_ALI_FACE_AWAKE':
						// 拉起支付宝刷脸
						my.startAPVerify({
							url,
							certifyId: token,
							success: function(res) {
								console.log('success', res)
							},
							fail: function(res) {
								console.log('fail', res)
							},
							complete: function(res) {
								console.log('complete', res)
							}
						})
						break;
					case 'RN_DONE':
						// 实名认证完成
						break;
					case 'E_AUTH_FINISHED':
						// 授权认证完成 
						break;
					case 'SIGN_SUCCESS':
						// 签署成功
						// 要跳转的页面或进行其他操作

						break;
					case 'SIGN_FAIL':
						// 签署失败
						break;
					case 'SEAL_EXAMINE':
						// 等待用印审批
						break;
					case 'REVOKE':
						// 签署流程撤销
						break;
					case 'REFUSE':
						// 拒签
						break;
					default:
						break;
				}
			},
			qianClick() {
				console.log('qq')
				// this.isQian=true
				// this.url=this.orderInfo.sign_url

				uni.navigateTo({
					url: '../lease_order_lists/hetong?url=' + encodeURIComponent(this.orderInfo.sign_url)
				})
			},
			daikouClick() {
				uni.navigateTo({
					url: '/pages/user/addBankCard?order_no=' + this.orderInfo.order_sn
				})
			},
			// 输出分期单位
			getPeriodsUnit(value) {
				// switch (value) {
				// 	case 'is_week':
				// 		return '周';
				// 	case 'is_month':
				// 		return '个月';
				// }
				return '个月';
			},

			// 支付方式
			getPayWay(type) {
				switch (type) {
					case 1:
						return '微信支付';
					case 2:
						return '支付宝支付';
					case 3:
						return '余额支付';
					case 4:
						return '线下支付'
				}
			},

			// 复制文本
			copyText(value) {
				copy(value)
				// uni.setClipboardData({
				// 	data: value,
				// 	success() {
				// 		uni.showToast({
				// 			title: '复制成功',
				// 			icon: 'success'
				// 		});
				// 	}
				// });
			},

			// 获取该订单应有的按钮
			getButtons(status) {
				const order = this.orderInfo;
				switch (status) {
					case 0:
						if (order.pay_way === 4) {
							if (order.pay_type == 2) {
								return [9];
							} else {
								return [];
							}

						}
						if (order.pay_type == 2) {
							return [0, 9];
						} else {
							return [];
						}

						// 待发货
					case 1:
						const btns2 = [];
						if (!Number(order.pay_status)) {
							btns2.unshift(0);
						}
						if (order.pay_type == 2) {
							btns2.unshift(9);

						}
						return btns2;
						// 待收货
					case 2:
						const btns1 = [2, 10];
						if (!Number(order.pay_status)) {
							btns1.unshift(0);
						}
						return btns1;
						// 租用中
					case 3: {
						// const btns = [5];
						const btns = [];
						if (order.pay_type == 2) {

						} else {
							if (!Number(order.pay_status)) {
								btns.unshift(0);
							}
							btns.unshift(13);
						}

						return btns;
					}
					// 已完成
					case 4: {
						const btns = [];

						return btns;
					}
					// 已关闭
					case 5:
						return [11];
						//待审核
					case 8:
						const btns = [];
						return btns;
				}
			},



			// 订单按钮
			onOrderButton(event) {
				switch (event) {
					// 立即付款
					case 'pay':
						return this.onOrderPay();
						// 提前还款
					case 'prepayment':
						return this.onOrderPrepayment();
						// 去还款
					case 'repayment':
						return this.onOrderRepayment();
						// 确认收货
					case 'receive':
						return this.onOrderReceive();
						// 去评价
					case 'evaluate':
						return this.onOrderEvaluate();
						// 还机
					case 'return':
						return this.onOrderReturn();
						// 买断
					case 'buy':
						return this.onOrderBuy();
						// 买断详情
					case 'buy_detail':
						return this.onOrderBuyDetail();
						// 还机详情
					case 'return_detail':
						return this.onOrderReturnDetail();
						// 续租
					case 'continue':
						return this.onOrderRelet();
						// 取消订单
					case 'close':
						return this.onOrderClose();
						// 查看物流
					case 'express':
						return this.onOrderExpress();
						// 删除订单
					case 'del':
						return this.onOrderDel();
						// 合同
					case 'contract':
						return this.onContract();
				}
			},

			// 点击合同
			onContract() {
				const id = this.orderID;
				uni.navigateTo({
					url: `/bundle/pages/lease_contract/lease_contract?id=${id}`
				})
			},
			// 按下提前还款
			onOrderPrepayment() {
				const payWay = this.orderInfo.pay_way;
				const id = this.orderID;
				prepayment({
					from: 'lease_order',
					order_id: id
				}).then(res => {
					const code = res.code;
					const data = res.data;

					switch (code) {
						// 微信支付
						case 1:
							return this.handlePayWeChat(data);
							// 支付宝支付
						case 20001:
							return this.handlePayAlipay1(data);
							// 余额支付
						case 10001:
							return;
					}
				});
			},
			// 按下立即付款按钮
			onOrderPay() {
				const payWay = this.orderInfo.pay_way;
				const id = this.orderID;

				prepay({
					from: 'lease_order',
					order_id: id
				}).then(res => {
					const code = res.code;
					const data = res.data;

					switch (code) {
						// 微信支付
						case 1:
							return this.handlePayWeChat(data);
							// 支付宝支付
						case 20001:
							return this.handlePayAlipay(data);
							// 余额支付
						case 10001:
							return;
					}
				});
			},

			// 按下去还款按钮
			onOrderRepayment() {
				const id = this.orderID;
				uni.navigateTo({
					url: `/bundle/pages/lease_bill/lease_bill?id=${id}`
				})
			},

			// 按下确认收货按钮
			onOrderReceive() {
				this.showConfirmOrderModal = true;
			},

			// 按下去评价按钮
			onOrderEvaluate() {
				const id = this.orderID;
				const goodsID = this.orderInfo?.lease_order_goods[0]?.id;
				uni.navigateTo({
					url: `/bundle/pages/lease_goods_reviews/lease_goods_reviews?id=${id}&goods_id=${goodsID}`
				});
			},

			// 按下还机按钮
			onOrderReturn() {
				const id = this.orderID;
				leaseReturnCheck({
					id,
					action: 'check'
				}).then(res => {
					const code = res.code;
					console.log(res);
					if (code == 1) {
						uni.navigateTo({
							// url: `/bundle/pages/lease_return_detail/lease_return_detail?id=${id}`
							url: `/bundle/pages/lease_return_express/lease_return_express?id=${id}`
						})
					} else {
						this.showReturnOrderPopup = true;
					}
				})
			},

			// 按下买断按钮
			onOrderBuy() {
				const id = this.orderID;
				uni.navigateTo({
					url: `/bundle/pages/lease_pay_buy/lease_pay_buy?id=${id}`
				})
			},

			// 按下买断详情按钮
			onOrderBuyDetail() {
				const id = this.orderID;
				uni.navigateTo({
					url: `/bundle/pages/lease_buy_detail/lease_buy_detail?id=${id}`
				})
			},

			// 按下还机详情按钮
			onOrderReturnDetail() {
				const id = this.orderID;
				uni.navigateTo({
					url: `/bundle/pages/lease_return_detail/lease_return_detail?id=${id}`
				})
			},

			// 按下续租按钮
			onOrderRelet() {
				uni.showLoading({
					title: '加载中'
				});
				const id = this.orderID;
				leaseOrderRelet({
					id,
					action: 'info'
				}).then(res => {
					uni.hideLoading();
					if (res.code != 1) return;
					this.showReletOrderPopup = true;
					const data = res.data;
					this.reletList = data;
					this.relet = data[0].periods_id;
				});
			},

			// 按下取消订单按钮
			onOrderClose(id) {
				this.showCloseOrderModal = true;
			},

			// 按下查看物流按钮
			onOrderExpress() {
				const id = this.orderID;
				uni.navigateTo({
					url: `/bundle/pages/goods_logistics/goods_logistics?id=${id}`
				})
			},

			// 按下删除订单按钮
			onOrderDel() {
				this.showDelOrderModal = true;
			},


			// 取消订单处理
			handleOrderClose() {
				const id = this.orderID;
				leaseOrderCancel({
					id
				}).then(res => {
					this.initData();
				});
			},

			// 删除订单处理
			handleOrderDel() {
				const id = this.orderID;
				leaseOrderDel({
					id
				}).then(res => uni.navigateBack());
			},

			// 确认收货处理
			handleOrderConfirm() {
				const id = this.orderID;
				leaseOrderConfirm({
					id
				}).then(res => this.initData());
			},

			// 续租处理
			handleRelet() {
				const id = this.orderID;

				leaseOrderRelet({
					id,
					periods_id: this.relet,
					action: 'submit',
				}).then(res => {
					this.showReletOrderPopup = false;
					if (res.code != 1) return;
					uni.showToast({
						title: '续租成功',
						icon: 'success'
					});
				});
			},

			// 前往还机
			goReturnOrder() {
				const id = this.orderID;
				this.showReturnOrderPopup = false;
				uni.navigateTo({
					url: '/bundle/pages/lease_goods_return/lease_goods_return' +
						'?id=' + id
				})
			},

			// 微信支付
			handlePayWeChat(data) {
				const id = this.orderID;
				wxpay(data).then(res => {
					if (res == 'success') {
						this.initData();
						uni.navigateTo({
							url: '/bundle/pages/lease_pay_result/lease_pay_result' +
								'?id=' + id
						});
					} else {
						uni.showToast({
							title: '支付失败',
							icon: 'none'
						});
					}
				})
			},
			handlePayAlipay1(data) {
				const id = this.orderID;
				var that = this
				// #ifdef H5
				alipay(data);
				// #endif


				// #ifdef MP-ALIPAY
				const tradeNo = data?.data?.trade_no;
				my.tradePay({
					tradeNO: tradeNo,
					success: (res) => {
						getAlipayPayStatus({
							trade_no: tradeNo
						}).then(res => {
							if (res.tradeStatus == 'TRADE_SUCCESS') {
								uni.showToast({
									title: '支付成功',
									icon: 'none'
								});
								that.initData();
							} else {
								uni.showToast({
									title: '支付失败',
									icon: 'none'
								});
							}
						});
					},
					fail: (res) => {
						console.log(res);
						uni.showToast({
							title: '支付失败',
							icon: 'none'
						});
					}
				});
				// #endif

			},
			// 支付宝支付
			handlePayAlipay(data) {
				const id = this.orderID;

				// #ifdef H5
				alipay(data);
				// #endif


				// #ifdef MP-ALIPAY
				const tradeNo = data?.data?.trade_no;
				my.tradePay({
					tradeNO: tradeNo,
					success: (res) => {
						getAlipayPayStatus({
							trade_no: tradeNo
						}).then(res => {
							if (res.tradeStatus == 'TRADE_SUCCESS') {
								uni.redirectTo({
									url: `/bundle/pages/lease_pay_result/lease_pay_result?id=${this.billInfo.id}`
								})
							} else {
								uni.showToast({
									title: '支付失败',
									icon: 'none'
								});
							}
						});
					},
					fail: (res) => {
						console.log(res);
						uni.showToast({
							title: '支付失败',
							icon: 'none'
						});
					}
				});
				// #endif

			},
			test_face() {
				test_face({

				}).then(res => {
					console.log('test_face', res)
					my.startAPVerify({
						url: res.data.url,
						certifyId: res.data.certify_id,
						success: function(res) {
							console.log('success', res)
							if (Number(res.resultStatus) == 9000) {
								uni.showToast({
									title: '验证成功',
									icon: 'none'
								});
							}
						},
						fail: function(res) {
							console.log('fail', res)
						},
						complete: function(res) {
							console.log('complete', res)
						}
					})
				});
			},
			// 初始化数据
			initData() {
				// 请求订单数据
				if(this.ordersn){
					getLeaseOrderDrdersn({
						id: this.ordersn
					}).then(res => {
						if (res.code != 1) return;
						const data = res.data;
						// 初始化数据
						this.orderInfo = data;
						this.orderStatus = data.order_status;
						this.goodsInfo = data.lease_order_goods[0];
					});
				}else{
					getLeaseOrderDetail({
						id: this.orderID
					}).then(res => {
						if (res.code != 1) return;
						const data = res.data;
						// 初始化数据
						this.orderInfo = data;
						this.orderStatus = data.order_status;
						this.goodsInfo = data.lease_order_goods[0];
					});
				}
			},

			// 待支付倒计时结束
			endPayCountDown() {
				this.initData();
			}
		},

		onLoad(options) {
			const id = options.id;
			const ordersn = options.ordersn;
			this.orderID = id;
			this.ordersn = ordersn;
			// this.test_face()
		},

		onShow() {

			this.initData();
		}
	}
</script>


<style scoped>
	.container {
		margin: 28rpx;
		padding: 20rpx;
		margin-bottom: 20rpx;
		border-radius: 7px;
		background-color: #FFFFFF;
	}

	.lease-order-detail {
		padding-bottom: 100rpx;
	}

	.header {
		position: relative;
	}

	.header-content {
		position: relative;
		padding: 20rpx 40rpx;
		color: #FFFFFF;

		/* #ifdef MP-ALIPAY || H5 */
		height: 200rpx;
		background-image: linear-gradient(to bottom, #FF4D40, #3187FD);
		/* #endif */
	}

	/* #ifndef MP-ALIPAY  || H5 */
	.header-content::after {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		z-index: -1;
		display: block;
		content: '';
		width: 100%;
		height: 200rpx;
		background-image: linear-gradient(to bottom, #FF4D40, #3187FD);
	}

	/* #endif */

	.header-title {
		font-weight: 500;
		font-size: 32rpx;
	}

	.header-value {
		font-size: 26rpx;
	}


	.main {
		padding: 20rpx;

		/* #ifdef MP-ALIPAY */
		position: relative;
		margin-top: -100rpx;
		/* #endif */
	}

	.address-consignee {
		font-size: 30rpx;
		font-weight: 500;
		color: #222222;
	}

	.address-delivery {
		font-size: 26rpx;
		color: #666666;
	}


	.periods-price {
		padding: 0 20rpx;
	}

	.periods-price-item {
		padding: 20rpx 0;
	}

	.periods-price-item:nth-child(n+2) {
		border-top: 1px solid #E5E5E5;
	}

	.periods-price-title {
		padding: 10rpx 0;
		font-size: 30rpx;
		font-weight: 500;
		color: #333333;
	}

	.periods-price-row {
		padding: 10rpx 0;
		font-size: 26rpx;
	}

	.periods-price-total {
		padding: 30rpx 0;
		text-align: right;
	}

	.periods-price-total-title {
		margin-right: 10rpx;
		font-size: 30rpx;
		color: #333333;
	}

	.remark {
		display: flex;
		font-size: 28rpx;
	}

	.remark-title {
		flex-shrink: 0;
		color: #333333;
	}

	.remark-content {
		box-sizing: border-box;
		margin-left: 30rpx;
		color: #999999;
		white-space: normal;
		word-break: break-all;
		overflow: hidden;
	}

	.express-row {
		display: flex;
		font-size: 28rpx;
	}

	.express-row:nth-child(n+2) {
		margin-top: 20rpx;
	}

	.express-row-title {
		color: #333333;
	}

	.express-row-content {
		flex: 1;
		margin-left: 30rpx;
		color: #101010;
	}

	.express-button--copy {
		box-sizing: border-box;
		display: flex;
		align-items: center;
		height: 100%;
		padding: 0 20rpx;
		border: 1px solid #D7D7D7;
		border-radius: 50px;
		font-size: 24rpx;
		color: #555555;
	}

	.order-footer {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 999;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		height: 100rpx;
		padding: 0 20rpx;
		/* 	border-radius: 10px 10px 0 0;
		box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16); */
		background-color: #FFFFFF;
	}

	.order-button {
		box-sizing: border-box;
		padding: 10rpx 40rpx;
		border-radius: 100px;
		font-size: 26rpx;
	}

	.order-button:nth-child(n+2) {
		margin-left: 20rpx;
	}

	.order-button--active {
		background-color: #FF4D40;
		color: #FFFFFF;
	}

	.order-button--inactive {
		border: 1px solid #D7D7D7;
		background-color: #FFFFFF;
		color: #666666;
	}

	.order-button--normal {
		background-color: #FFFFFF;
		border: 1px solid #FF4D40;
		color: #FF4D40;
	}

	.order-button--error {
		background-color: #FFFFFF;
		border: 1px solid #FF2C3C;
		color: #FF2C3C;
	}

	.relet,
	.return {
		width: 640rpx;
		padding: 30rpx 40rpx;
		background-color: #FFFFFF;
	}

	.relet-title,
	.return-title {
		padding-bottom: 30rpx;
		text-align: center;
		font-weight: 500;
		font-size: 34rpx;
		color: #333333;
	}

	.relet-label {
		font-size: 28rpx;
		color: #333333;
	}

	.relet-list {
		display: flex;
		flex-wrap: wrap;
	}

	.relet-item {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 152rpx;
		height: 58rpx;
		margin: 20rpx 20rpx 0 0;
		border-radius: 50px;
		font-size: 26rpx;
		color: #333333;
		background-color: #F4F4F4;
	}

	.relet-item--active {
		background-color: #E8F6FF;
		box-shadow: 0 0 0 1px #FF4D40;
		color: #FF4D40;
	}

	.relet-widget,
	.return-widget {
		display: flex;
		justify-content: space-between;
		margin-top: 84rpx;
	}

	.relet-cancel,
	.relet-confirm,
	.return-cancel,
	.return-confirm {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 268rpx;
		height: 74rpx;
		font-size: 32rpx;
		border-radius: 50px;
	}

	.relet-cancel,
	.return-cancel {
		background-color: #F6F6F6;
		color: #666666;
	}

	.relet-confirm,
	.return-confirm {
		background-color: #FF4D40;
		color: #FFFFFF;
	}

	.topView {
		height: 578rpx;
		background: linear-gradient(180deg, #FF4D40 0%, rgba(101, 190, 255, 0) 100%);
	}

	.orderImage {
		width: 152rpx;
		height: 168rpx;
	}

	.statusTitle {
		font-size: 42rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 550;
		color: #FFFFFF;
	}

	.statusTitle1 {
		margin-top: 18rpx;
		font-size: 27rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
	}

	.addressView {
		padding: 38rpx 28rpx;
		margin: 18rpx 28rpx;
		background: #FFFFFF;
		border-radius: 15rpx 15rpx 15rpx 15rpx;
	}

	.addressName {
		font-size: 31rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 550;
		color: #333333;
	}

	.delivery_address {
		margin-top: 15rpx;
		font-size: 27rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #666666;
	}

	.view1 {
		margin: 28rpx;
		padding: 20rpx;
		background: #FFFFFF;
		border-radius: 11rpx 11rpx 11rpx 11rpx;
	}

	.itemView {
		height: 70rpx;
	}

	.leftTitle {
		font-size: 27rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 550;
		color: #333333;
	}

	.rightTitle {
		font-size: 27rpx;
		font-family: DIN-Medium, DIN;
		font-weight: 550;
		color: #333333;
	}

	.leftTitle1 {
		font-size: 27rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #666666;
	}

	.rightTitle1 {
		font-size: 27rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #666666;
	}

	.store_name {
		font-size: 27rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #000000;
	}
</style>